<template>
	<view>
		<view style="position: relative;" v-for="item in data" :key="item.id">
			<view class="imgs">
				<image :src="item.scene_pic_url"></image>
			</view>
			<view class="simple_desc">{{item.title}}</view>
			<view class="simple_desc">{{item.subtitle}}</view>
			<view class="simple_desc" style="margin-bottom: 40rpx;">{{'￥'+item.price_info+'元'}}</view>
		</view>
		<view style="display: flex;justify-content: space-between;">
			<button style="width:45%" @click="pre" :type="show?'primary':''">上一页</button>
			<button style="width:45%" @click="next" :type="show?'':'primary'">下一页</button>
		</view>
	</view>
</template>

<script>
	import request from "../../request/request.js";
	import {
		issueAPI
	} from "../../request/api.js"
	export default {
		data() {
			return {
				data: [],
				page: 1,
				size: 10,
				show: false
			}
		},
		onLoad() {
			this.getIssue()
		},
		methods: {
			pre() {
				if (this.page == 1) {
					uni.showToast({
						title: '最后一页啦',
						icon: 'error',
						duration: 1000
					})

				} else {

					this.page = this.page - 1,
						this.show = !this.show

					this.getIssue(this.page)
				}

			},
			next() {
				if (this.page != 2) {

					this.page = this.page + 1,
						this.show = !this.show

					this.getIssue(this.page)
				} else {
					uni.showToast({
						title: '最后一页啦',
						icon: 'error',
						duration: 1000
					})
				}
			},
			async getIssue(page = 1, size = 10) {
				let res = await request({
					data: {
						page,
						size
					},
					url: issueAPI,
					successCallBack: (res) => {
						console.log(res)
						this.data = res.data.data.data
						console.log(this.data)
					},
					failCallBack: (err) => {
						console.log(err)
					}
				})
				// console.log(res)





			}
		}
	}
</script>

<style lang="scss" scoped>
	.imgs {
		position: relative;
		width: 100vw;
		height: calc(400*100vw/750);
	}

	.imgs image {
		width: 100vw;
		height: calc(400*100vw/750);

	}

	.txt {
		position: absolute;
		top: 180rpx;
		left: 35%;
		color: #fff;
		font-size: 40rpx;
		text-decoration: underline;
	}

	.simple_desc {
		width: 100vw;
		background-color: #fff;
		font-size: 35rpx;
		text-align: center;
		line-height: 60rpx;
		color: #333;
		padding: 30rpx;
		box-sizing: border-box;
	}
</style>
